<!-- 
  @Created by pangzg pangzg2@yusys.com.cn on 2020-4-13 13:56:49.
  @updated by
  @description 联系人所属组管理
-->
<div>
  <yu-panel title="联系人所属组管理">
    <yu-xform related-table-name="refTable" form-type="search">
      <yu-xform-group :column="4">
        <yu-xform-item label="组名" placeholder="组名" ctype="input" name="rolename"></yu-xform-item>
      </yu-xform-group>
    </yu-xform>
    <yu-toolBar>
      <yu-button @click="addFn" v-if="addFnButton">新增</yu-button>
      <yu-button @click="modifyFn" v-if="updateFnButton">修改</yu-button>
      <yu-button @click="deleteFn" v-if="deleteFnButton">删除</yu-button>
      <yu-button @click="relFn" v-if="relButton">组员管理</yu-button>
    </yu-toolBar>
	<div ref="tableBox" style="overflow: auto;">
		<yu-xtable :height="tbHeight" ref="refTable" row-number :data-url="dataUrl" selection-type="checkbox" @row-click="cellClick">
		  <yu-xtable-column label="组名" :show-overflow-tooltip="true" prop="rolename"></yu-xtable-column>
		  <yu-xtable-column label="负责人" :show-overflow-tooltip="true" prop="personInCharge"></yu-xtable-column>
		  <yu-xtable-column label="组员" :show-overflow-tooltip="true" prop="contact"></yu-xtable-column>
		  <yu-xtable-column label="添加时间" :show-overflow-tooltip="true" prop="addTime"></yu-xtable-column>
		  <yu-xtable-column label="描述" :show-overflow-tooltip="true" prop="description"></yu-xtable-column>
		</yu-xtable>
	</div>
  </yu-panel>
  <yu-dialog :title="viewTitle" :visible.sync="dialogVisible">
    <yu-xform ref="refForm" v-model="formdata" label-width="120px">
      <yu-xform-group>
        <yu-xform-item label="组名" ctype="input" name="rolename" :disabled="!addFlag" rules="required"></yu-xform-item>
        <yu-xform-item label="负责人" ctype="select" name="personInCharge" rules="required" :options="options"></yu-xform-item>
        <yu-xform-item label="描述" ctype="input" name="description"></yu-xform-item>
      </yu-xform-group>
    </yu-xform>
    <div class="yu-grpButton">
      <yu-button v-show="cancelBtnShow" @click="cancelFn">取消</yu-button>
      <yu-button type="primary" v-if="!saveDisabled" @click="saveFn">保存</yu-button>
    </div>
  </yu-dialog>
  <yu-dialog title="管理组员" :visible.sync="relDialogVisible">
    <yu-xform related-table-name="refRelTable" form-type="search" v-model="searchFormdata">
      <yu-xform-group :column="4">
        <yu-xform-item label="联系人名" placeholder="联系人名" colspan="18" ctype="input" name="rolename"></yu-xform-item>
      </yu-xform-group>
    </yu-xform>
    <yu-toolBar>
      <yu-button @click="addRelFn">新增</yu-button>
      <yu-button @click="deleteDelFn">删除</yu-button>
    </yu-toolBar>
    <yu-xtable ref="refRelTable" row-number :data-url="relUrl" selection-type="radiobox" height="300px">
      <yu-xtable-column label="联系人名" prop="rolename"></yu-xtable-column>
      <yu-xtable-column label="手机号" prop="contact"></yu-xtable-column>
      <yu-xtable-column label="添加时间" prop="addTime"></yu-xtable-column>
      <yu-xtable-column label="描述" prop="description"></yu-xtable-column>
    </yu-xtable>
  </yu-dialog>
  <yu-dialog title="新增组员" :visible.sync="addRelDialogVisible">
    <yu-xform ref="addRelForm" v-model="addRelformdata" label-width="120px">
      <yu-xform-group>
        <yu-xform-item label="联系人名" ctype="select" name="rolename" rules="required" :options="options"></yu-xform-item>
      </yu-xform-group>
    </yu-xform>
    <div class="yu-grpButton">
      <yu-button type="primary" @click="saveRelFn">保存</yu-button>
    </div>
  </yu-dialog>

</div>